<div id="homepage_banner">
  <ons-carousel #carousel swipeable auto-scroll overscrollable id="carousel" *ngIf="banner">
    <ons-carousel-item *ngFor="let b of banner">
      <a href={{b.url}}>
        <img class="banner-item" src={{b.path}}>
      </a>
    </ons-carousel-item>
  </ons-carousel>
</div>
<!-- 列表 -->
<div id="car_list">
  <!-- <ons-gesture-detector> -->
    <ons-list #ul>
      <div *ngFor="let list of car" class="car-list">
          <div class="action">
              <span class="delete" (click)="deleteCar(list)">删除</span>
            <a class="edit" routerLink="/bindId/{{list.car_id}}" [queryParams]="{isEdit: true}">编辑</a>
          </div>
        <a class="car-item" routerLink="/carInfo" [queryParams]="{id: list.car_id}">
          <ons-list-item>
            <div class="center">
              <span class="list-item__title">{{list.plateNumber}}</span>
              <span class="list-item__subtitle">{{list.carType=='02'?'小车':'大车'}}</span>
            </div>
            <div class="right">
              <span>{{list.description}}</span>
            </div>
          </ons-list-item>
        </a>
      </div>
    </ons-list>
  <!-- </ons-gesture-detector> -->
  <div class="empty-tip" *ngIf="car.length">左滑删除车辆/编辑照片</div>
</div>
<div *ngIf="!car.length && !carLoading" class="empty-tip">
  查询违章信息, 提供违章处理服务
  <p style="font-size: 16px;margin-top: 10px;font-weight: bolder;">
    <a routerLink="/addCar" class="highlight">点击输入车辆信息</a>
  </p>
</div>
<div *ngIf="carLoading" class="empty-tip">
  加载中…
</div>
<ons-fab *ngIf="car.length" position="right bottom" (click)="add()">
  <ons-icon icon="ion-plus" size="24px"></ons-icon>
</ons-fab>
